<template>
    <div class="main_box" style="padding:10px">
      <div class="add_wrap">
        <div class="tit">
          <h2>{{dataForm.departId?'编辑商户部门':'新增商户部门'}}</h2>
          <el-button type="success" plain size="small" icon="fa fa-mail-forward" @click="returnList">返回</el-button>
        </div>
        <el-form :model="dataForm" ref="dataForm" label-width="200px" :rules="roleRules">
          <el-row>
            <el-form-item label="上级部门：" prop="parentDepartId">
                {{ parentDepartName||'无' }}
            </el-form-item>
            <el-form-item label="部门名称：" prop="departName">
              <el-input :clearable="true" v-model="dataForm.departName" @keydown.native="keydown($event)"></el-input>
            </el-form-item>

            <!-- <el-form-item label="部门负责人：" prop="managerUserId">
              <el-select v-model="dataForm.managerUserId" :clearable="true" placeholder="请选择部门负责人">
                <el-option v-for="item in listAdmin" :key="item.userId" :label="item.userName" :value="item.userId"></el-option>
              </el-select>
            </el-form-item> -->
            <el-form-item label="备注：" prop="remark">
              <el-input type="textarea" :clearable="true" v-model="dataForm.remark"></el-input>
            </el-form-item>
            <el-form-item label="火警通知内容：" prop="remark">
              <el-input type="textarea" :clearable="true" v-model="dataForm.fireContent"></el-input>
            </el-form-item>
          </el-row>
          <el-row>
            <el-form-item>
              <el-button plain type="primary" @click="sureClick">保 存</el-button>
              <el-button @click="returnList">取 消</el-button>
            </el-form-item>
          </el-row>
        </el-form>
      </div>
     </div>
    </template>

    <script>
    import * as message from "@/constants/message";
    import BusinessDepartApi from "@/api/business/depart"
    export default{
      data(){
          return {
            dataForm:{
              departId: "",
              parentDepartId: "",
              levels:"",
              departName: "",
              managerUserId: "",
              managerUserName: "",
              remark:"",
              fireContent:''
            },
            parentDepartName:"",
            levelsList:[
                {value:0,label:"商户"},
                {value:1,label:"部门"},
                {value:2,label:"组"},
                {value:4,label:"岗位"},
            ],
            roleRules: {
              parentDepartId: [
                { required: true, message: "请选择上级部门", trigger: "change" },
              ],
              departName: [
                { required: true, message: "请输入部门名称", trigger: "blur" }
              ],
              managerUserName: [
                { required: true, message: "请输入部门负责人", trigger: "blur" }
              ]
            }
          }
      },
      mounted(){
        this.init();
      },
      methods: {
        init(){
            const query = this.$route.query
            if(query.parentId){
                this.dataForm.parentDepartId = query.parentId
                this.parentDepartName =query.parentName
            }

            if(query.id){
                this.dataForm.departId = query.id
                this.getData();
            }
        },
        keydown(e) {
          if (e.keyCode == 32) {
            e.returnValue = false;
          }
        },
        getData(){
            BusinessDepartApi.getBusinessDepartInfo({id:this.dataForm.departId})
            .then(res => {
              this.$Utils.bindingBean(this.dataForm, res.data);
            })
        },
        sureClick() {
          this.$refs.dataForm.validate(valid => {
            if (valid) {
              this.$confirm(message.MSG_CONFIRM_SAVE_ALTER, message.TITLE_PROMPT, {})
                .then(() => {
                  if (this.dataForm.departId){
                    this.editData();
                  }else{
                    this.addData();
                  }
                });
            }
          })
        },
        addData() {
          let data = {
            parentDepartId: this.dataForm.parentDepartId,
            departName: this.dataForm.departName,
            remark: this.dataForm.remark,
            fireContent:this.dataForm.fireContent
          };
          BusinessDepartApi.addBusinessDepart(data)
            .then(data => {
              this.$notify.success({
                title: message.TITLE_SUCCESS,
                message: message.MSG_ACTION_SUCCESS
              });
            this.returnList()
          })
        },
        editData() {
          let data = {
            departId:this.$route.query.id,
            parentDepartId: this.dataForm.parentDepartId,
            departName: this.dataForm.departName,
            remark: this.dataForm.remark,
            fireContent:this.dataForm.fireContent
          };
          BusinessDepartApi.editBusinessDepart(data)
            .then(res => {
              this.$Utils.notifySuccess()
              this.returnList()
            })
        },
        returnList(){
          this.$store.dispatch('delView', this.$route);
          this.$router.push({path: '/business/businessDepartManagement'})
        }
      }
    }
    </script>
<style lang="scss" scoped>
@import "@/assets/css/views/add.scss";
</style>
<style lang="scss">
@import "@/assets/css/views/content.scss";
</style>
